<template>
	<view class="content">
		<view class="status_bar"></view>
		<Head :webtext="webtext"></Head>
		<view class="body">
			<view class="formBox">
				<view class="form-bg">
					<view class="bankimg">
						<img src="../../static/bankUnit.png" height="30" />
						<span>银行卡</span>
					</view>
					<u-form ref="uForm" class="formList" label-width="240upx">
						<u-form-item label=" 账户余额 " label-align="right"><span>{{userinfo.money}}</span></u-form-item>
						<u-form-item label="银行卡号 " label-align="right">
							{{bank.bank_card_star}}
							<!-- <u-dropdown v-model="bank.bank_card_star" class="dropdown" active-color="#fff"><u-dropdown-item title="请选择银行卡"></u-dropdown-item></u-dropdown> -->
						</u-form-item>
						<u-form-item label="金额 " label-align="right"><input type="number" class="input" v-model="money" placeholder="赎金范围" /></u-form-item>
						<u-form-item label="资金密码 " label-align="right"><input class="input" v-model="funds_pass" placeholder="请输入资金密码" /></u-form-item>
					</u-form>
				</view>
			</view>
			<view class="button" @click="submit">确定</view>
			<view class="withdrawTip">
				<view>
					<p>
						1. 有问题请咨询
						<a style="color:#007aff;" @click="switchTab(url1)">在线客服</a>
					</p>
					<p>2. 赎回时间：每天11:00:00-23:00:00</p>
					<!-- ，今日已赎回次数：0/3 -->
					<p>3. 每天免费赎回3次，第4次起收取1%手续费，单笔最高赎回额度：1000000</p>
				</view>
			</view>
			<u-toast ref="uToast" :icon="false" />
		</view>
	</view>
</template>

<script>
import Head from '../../components/head.vue';
export default {
	components: {
		Head
	},
	data() {
		return {
			webtext: '赎回',
			url1: '/pages/customer/index',
			money:'',
			funds_pass:'',
			rules: {},
			userinfo:{},
			bank:{}
		};
	},
	onShow() {
		this.$u.api.withdraw().then(res => {
			this.userinfo = res.member_info
			this.bank = res.member_bank
		})
	},
	methods: {
		switchTab(url) {
			uni.switchTab({
				url: url
			});
		},
		submit() {
			if(this.money && this.funds_pass){
				this.$u.api.do_withdraw({
					money: this.money,
					way: 3,
					card: this.bank.bank_card,
					card_name: this.bank.bank_name,
					remark: this.bank.user_name,
					funds_pass: this.funds_pass,
				}).then(res => {
					console.log(res,"????");
				})
			}else{
				uni.showToast({
					title: '请填写全部信息',
					duration: 1000,
					icon: 'none'
				});
			}
		}
	}
};
</script>

<style lang="scss" scoped>
.formBox {
	.form-bg {
		padding: 10upx 40upx;
		color: #f4f8ff;
		.bankimg {
			margin-bottom: 20upx;
			display: flex;
			align-items: center;
			border-bottom: 2upx solid #555;
			height: 100upx;
			line-height: 100upx;
			padding-bottom: 20upx;
			img {
				margin-right: 20upx;
			}
			span {
				line-height: 50px;
			}
		}
		.formList {
			display: flex;
			flex-wrap: wrap;
			font-size: 28upx;
			width: 100%;
			.u-form-item {
				height: 80upx;
				line-height: 80upx;
				width: 100%;
				margin-bottom: 30upx;
				color: #f4f8ff;
				span {
					color: #da7d1c;
				}
				.dropdown {
					width: calc(100% - 220upx);
					border: 2upx solid #fff;
					border-radius: 6upx;
				}
			}
			.input {
				line-height: 42upx;
				width: 100%;
				height: 30upx;
				padding: 20upx 30upx;
				border: 2upx solid rgba(0, 0, 0, 0.2);
				border-radius: 6upx;
				outline: 0;
				background: #31395e;
				font-size: 28upx;
			}
			.u-border-bottom:after {
				border-bottom-width: 0upx;
			}
		}
	}
}
.button {
	width: calc(100% - 80upx);
	font-size: 34upx;
	margin: 30upx auto;
	height: 80upx;
	line-height: 80upx;
	color: #fff;
	background: #0da3ff;
	padding: 0 40upx;
	text-align: center;
	border-radius: 10upx;
}
.withdrawTip {
	margin: 20upx 0;
	padding: 40upx;
	p {
		line-height: 48upx;
		color: #f4f8ff;
	}
}
/deep/ .u-dropdown__menu__item {
	width: 100%;
	justify-content: flex-start !important;
	.u-flex {
		width: 100%;
		padding: 0 10upx;
		justify-content: space-between;
	}
}
</style>
